<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <title>我的积分</title>
    <link rel="stylesheet" th:href="@{/css/style.css}" />
</head>
<body>
<div class="container">
    <h1>我的积分</h1>
    <p>当前积分：<strong th:text="${user.points}">0</strong></p>
    <a href="/dashboard" class="btn">返回控制台</a>
    <hr/>
    <h3>可兑换礼品</h3>
    <ul>
        <li th:each="g : ${gifts}">
            <span th:text="${g.name}"></span> - 需要积分：<span th:text="${g.costPoints}"></span>
            | 库存：<span th:text="${g.stock}"></span>
            <form th:action="@{'/redeem/' + ${g.id}}" method="post" style="display:inline">
                <button class="btn" type="submit">兑换</button>
            </form>
        </li>
    </ul>
    <hr/>
    <h3>积分变更记录</h3>
    <table class="table">
        <thead><tr><th>时间</th><th>变更</th><th>原因</th></tr></thead>
        <tbody>
        <tr th:each="t : ${txs}">
            <td th:text="${#temporals.format(t.createdAt, 'yyyy-MM-dd HH:mm')}"></td>
            <td th:text="${t.changeAmount}"></td>
            <td th:text="${t.reason}"></td>
        </tr>
        </tbody>
    </table>
</div>
</body>
</html>